<!DOCTYPE html>
<html>

<head>
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
	<meta charset="utf-8" />
	<title>设备管理</title>

	<meta name="description" content="overview &amp; stats" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />

	<!-- bootstrap & fontawesome -->
	<link rel="stylesheet" href="/backpage/files/assets/css/bootstrap.min.css" />
	<link rel="stylesheet" href="/backpage/files/assets/font-awesome/4.5.0/css/font-awesome.min.css" />

	<!-- page specific plugin styles -->

	<!-- text fonts -->
	<link rel="stylesheet" href="/backpage/files/assets/css/fonts.googleapis.com.css" />

	<!-- ace styles -->
	<link rel="stylesheet" href="/backpage/files/assets/css/ace.min.css" class="ace-main-stylesheet"
		id="main-ace-style" />

	<!--[if lte IE 9]>
			<link rel="stylesheet" href="/backpage/files/assets/css/ace-part2.min.css" class="ace-main-stylesheet" />
		<![endif]-->
	<link rel="stylesheet" href="/backpage/files/assets/css/ace-skins.min.css" />
	<link rel="stylesheet" href="/backpage/files/assets/css/ace-rtl.min.css" />

	<!--[if lte IE 9]>
		  <link rel="stylesheet" href="/backpage/files/assets/css/ace-ie.min.css" />
		<![endif]-->

	<!-- inline styles related to this page -->

	<!-- ace settings handler -->
	<script src="/backpage/files/assets/js/ace-extra.min.js"></script>

	<!-- HTML5shiv and Respond.js for IE8 to support HTML5 elements and media queries -->

	<!--[if lte IE 8]>
		<script src="/backpage/files/assets/js/html5shiv.min.js"></script>
		<script src="/backpage/files/assets/js/respond.min.js"></script>
		<![endif]-->

	<!--[if !IE]> -->
	<script src="/backpage/files/assets/js/jquery-2.1.4.min.js"></script>
	<!-- <![endif]-->
	<!--[if IE]>
		<script src="/backpage/files/assets/js/jquery-1.11.3.min.js"></script>
		<![endif]-->
	<!--自定义的主要css-->
	<link rel="stylesheet" href="/backpage/files/css/common.css" />


	<!--时间控件-->
	<link href="/backpage/files/js/mobiscroll/mobiscroll.frame.css" rel="stylesheet" type="text/css">
	<link href="/backpage/files/js/mobiscroll/mobiscroll.scroller.css" rel="stylesheet" type="text/css">
	<script src="/backpage/files/js/mobiscroll/mobiscroll.core.js"></script>
	<script src="/backpage/files/js/mobiscroll/mobiscroll.frame.js"></script>
	<script src="/backpage/files/js/mobiscroll/mobiscroll.scroller.js"></script>
	<script src="/backpage/files/js/mobiscroll/mobiscroll.util.datetime.js"></script>
	<script src="/backpage/files/js/mobiscroll/mobiscroll.datetimebase.js"></script>
	<script src="/backpage/files/js/mobiscroll/mobiscroll.datetime.js"></script>
	<script src="/backpage/files/js/mobiscroll/mobiscroll.i18n.zh.js"></script>

</head>

<body class="no-skin">

	<div class="main-container ace-save-state" id="main-container">

		<div class="main-content" style="margin-left: 0px;">
			<div class="main-content-inner">
				<div class="page-content">


					<!-- /.page-header-->
					<div class="page-header">
						<h1>排班管理</h1>
					</div>


					<div class="row">
						<div class="col-xs-12">

							<div>
								<div id="dynamic-table_wrapper" class="dataTables_wrapper form-inline no-footer">
									<div class="row">
										<div class="col-xs-12">
											<label style="margin-left: 20px;">科室：</label>
											<select>
												<option>科室1</option>
												<option>科室2</option>
												<option>科室3</option>
											</select>
											<label>人员：</label>
											<select>
												<option>未选择</option>
												<option>人员1</option>
												<option>人员2</option>
												<option>人员3</option>
											</select>
											<button class="btn btn-success btn-sm" type="button">上传</button>
											<button class="btn btn-primary btn-sm" onclick="addUser()">定时设置</button>
											<label>日志：</label>
											<select>
												<option>全部日志</option>
												<option>正常日志</option>
												<option>错误日志</option>
											</select>
											<button class="btn btn-danger btn-sm" onclick="addUser()">删除日志</button>
										</div>
									</div>
									<table id="simple-table"
										class="table table-striped table-bordered table-hover dataTable no-footer"
										role="grid" aria-describedby="dynamic-table_info">
										<thead>
											<tr role="row">
												<th class="center sorting_disabled" style="width:3%"><label
													class="pos-rel"> <input type="checkbox" class="ace">
														<span class="lbl"></span> </label>
												</th>
												<th class="col-xs-1">日志类型</th>
												<th class="col-xs-1">发生时间</th>
												<th>日志内容</th>
											</tr>
										</thead>

										<tbody id="mainTbody">

										</tbody>
									</table>
									<div class="row">
										<div class="col-xs-12">
											<ul id="pageLimit" style="margin: 0;display: inline;cursor: pointer ; ">
											</ul>
										</div>
									</div>
								</div>
							</div>

						</div>
						<!-- /.col -->
					</div>
					<!-- /.row -->
				</div>
				<!-- /.page-content -->
			</div>
		</div>
		<!-- /.main-content -->
	</div>
	<!-- /.main-container -->


	<!--弹出框 -->
	<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content col-xs-8" style="padding: 0;">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
					<h4 class="modal-title" id="myModalLabel">用户信息</h4>
				</div>
				<div class="modal-body col-sm-12">
					<div class="col-sm-12">
						<label class="col-sm-3 text-right">每隔</label>
						<input class="col-xs-2" value="1" type="number" min="1" id="hour" name="hour"/>
						<label class="col-sm-3 text-left">小时执行</label>
					</div>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default btn-sm" data-dismiss="modal">关闭</button>
					<button type="button" class="btn btn-primary btn-sm" onclick="addJobHour()">设置</button>
				</div>
			</div>
			<!-- /.modal-content -->
		</div>
		<!-- /.modal-dialog -->
	</div>
	<!-- /.modal -->


	<!--弹出框 定时-->
	<div class="mymodal fade" id="timeModal">
		<div class="mymodal-dialog">
			<div class="mymodal-content">
				<div class="mymodal-header">
					<button type="button" class="close"
						onclick="$(this).parent().parent().parent().parent().hide();">×</button>
					<h4 class="mymodal-title" id="timeModalLabel">用户信息</h4>
				</div>
				<div class="mymodal-body col-sm-12">
					<div class="col-sm-12 mb5 ">
						<button type="button" class="btn btn-primary btn-xs" id="addTimeButton">添加</button>
					</div>
					<div class="col-sm-12 " id="timeList">
						无数据
					</div>
				</div>
				<div class="mymodal-footer">
					<button type="button" class="btn btn-default btn-sm" data-dismiss="mymodal"
						onclick="$(this).parent().parent().parent().parent().hide();">关闭</button>
					<!--<button type="button" class="btn btn-primary btn-sm"  onclick="save()">提交</button>-->
				</div>
			</div>
			<!-- /.modal-content -->
		</div>
		<!-- /.modal-dialog -->
	</div>
	<!-- /.modal -->


	<!-- basic scripts -->

	<script src="/backpage/files/assets/js/bootstrap.min.js"></script>

	<!-- page specific plugin scripts -->

	<!--[if lte IE 8]>
		  <script src="/backpage/files/assets/js/excanvas.min.js"></script>
		<![endif]-->
	<script src="/backpage/files/assets/js/jquery-ui.custom.min.js"></script>
	<script src="/backpage/files/assets/js/jquery.ui.touch-punch.min.js"></script>
	<script src="/backpage/files/assets/js/jquery.easypiechart.min.js"></script>
	<script src="/backpage/files/assets/js/jquery.sparkline.index.min.js"></script>
	<script src="/backpage/files/assets/js/jquery.flot.min.js"></script>
	<script src="/backpage/files/assets/js/jquery.flot.pie.min.js"></script>
	<script src="/backpage/files/assets/js/jquery.flot.resize.min.js"></script>

	<!-- ace scripts -->
	<script src="/backpage/files/assets/js/ace-elements.min.js"></script>
	<script src="/backpage/files/assets/js/ace.min.js"></script>

	<script src="/backpage/files/js/bootstrap-paginator.js"></script>
	<script src="/backpage/files/js/md5.js"></script>
	<script src="/backpage/files/js/common.js"></script>

	<script type="text/javascript">
		var active_class = 'active';//复选框样式
		var currentPage = 1;//当前页
		var pageSize = 20;//显示多少页
		var countPage = 0;//一共多少页
		var objects = [];//当前页面数据
		var object = {};//某一组数据
		var clients = [];//链接到MQTT的当前客户端
		
		//添加弹出
		function addUser() {
			$("#myModal").modal('show');
			$("#myModalLabel").html("添加用户");

			object.id = "";
			$("#id").val("");
			$("#id").removeAttr("disabled");
			$("#name").val("");
			$("#area").val("");
			$("#position").val("");
		}
		
		function addJobHour(){
			var hour = $("#hour").val();
			var data = {};
			data.hour=hour;
			$.ajax({
				url: '/common/addJobHour',
				type: "post",
				async: true,
				data: data,
				success: function (data) {
					console.log("result:" + data);
					if (data == 1) {
						alert("成功！");
						$("#myModal").modal('hide');
					}
					if (data == 0) {
						alert("失败！");
					}
				},
				error: function (error) {
					alert(JSON.stringify(error));
				}
			})
		}

		/*复选框*/
		$('#simple-table > thead > tr > th input[type=checkbox]').eq(0).on('click', function () {
			var th_checked = this.checked;//checkbox inside "TH" table header
			$(this).closest('table').find('tbody > tr').each(
				function () {
					var row = this;
					if (th_checked)
						$(row).find(
							'input[type=checkbox]').eq(0).prop(
								'checked', true);
					else
						$(row).find(
							'input[type=checkbox]').eq(0).prop(
								'checked', false);
				});
		});


		

		

		/*查询，分页*/
		function list(ifSearch) {

			if (ifSearch) {
				currentPage = 1;
			}

			var data = {
				currentPage: currentPage,
				pageSize: pageSize,
				searchText: $("#searchText").val()
			};

			var dataSubmit = {};
			dataSubmit.data = JSON.stringify(data);

			$.ajax({
				url: '/device/list',
				type: 'POST',
				async: true,
				data: dataSubmit,
				timeout: 5000,
				dataType: 'json',
				success: function (data, textStatus, jqXHR) {

					var count = data.count;
					var data = data.data;
					objects = data;
					var html = "";

					console.log(data);
					clients=[];
					for (var i = 0; i < data.length; i++) {
						var obj = data[i];
						var statusName = "";
						var statusOperatName = "";
						if (obj.status == 1) {
							statusName = "启用";
							statusOperatName = "禁用";
						}
						if (obj.status == 0) {
							statusName = "禁用";
							statusOperatName = "启用";
						}
						

						html += '<tr>' +
							'	<!--<td class="center">';
						html += '<label class="pos-rel"><input type="checkbox" class="ace" value="' + obj.id + '"/> <span class="lbl"></span></label>';
						html += '	</td>-->' +
							'	<td>' + obj.area + '</td>' +
							'	<td>' + obj.name + '</td>' +
							'	<td>' + obj.id + '</td>' +
							'	<td>' + obj.position + '</td>' +
							'	<td id="status' + obj.id + '">未连接</td>' +
							'	<td id="alarm' + obj.id + '" class="greenColor">正常</td>' +
							'	<td>0</td>' +
							'	<td><span class="glyphicon glyphicon-signal'+(i>3?"":i)+'"></span></td>' +
							'	<td>' +
							'		<button id="openBtn'+obj.id+'" class="btn btn-success btn-xs" onclick="openSheBei(\'' + obj.id + '\')">开启</button>' +
							'		<button id="closeBtn'+obj.id+'" class="btn btn-danger btn-xs" onclick="closeSheBei(\'' + obj.id + '\')">关闭</button>' +
							'		<button class="btn btn-success btn-xs" onclick="update(\'' + obj.id + '\')">修改</button>' +

							'		<button class="btn btn-pink btn-xs" onclick="addTime(\'' + obj.id + '\',\'' + obj.name + '\',\'普通定时\',\'1\')">普通定时</button>' +
							'		<button class="btn btn-primary btn-xs" onclick="addTime(\'' + obj.id + '\',\'' + obj.name + '\',\'重复定时\',\'2\')">重复定时</button>' +
							'		<button class="btn btn-success btn-xs" onclick="addTime(\'' + obj.id + '\',\'' + obj.name + '\',\'周定时\',\'3\')">周定时</button>' +
							'		<button class="btn btn-danger btn-xs" onclick="delDevice(\'' + obj.id + '\')">删除</button>' +
							'  </td>' +
							'</tr>';
					}
					
					$("#mainTbody").html(html);

					countPage = Math.ceil(count / pageSize);
					$('#pageLimit').bootstrapPaginator({
						currentPage: currentPage,
						totalPages: countPage,
						size: "normal",
						bootstrapMajorVersion: 3,
						alignment: "left",
						shouldShowPage: true,
						numberOfPages: pageSize,//显示多少页

						onPageClicked: function (event, originalEvent, type, page) {//给每个页面绑定一个事件，其实就是ajax请求，其中page变量为当前点击的页上的数字。
							if (page < 1) {
								currentPage = 1;
							} else if (page > countPage) {
								currentPage = countPage;
							} else {
								currentPage = page;
							}
							list();
						}
					});

					$('#pageLimit').append("<li style='cursor: text; '>&nbsp;&nbsp;共" + countPage + "页，跳转到&nbsp;<input id='pageNum' style='width:40px;'/>&nbsp;页</li>&nbsp;<button class='btn btn-success btn-xs' onclick='javascript:goPage()'>确定</button>");

				},
				error: function (xhr, textStatus) {
					console.log('错误');
					console.log(xhr);
					console.log(textStatus);
				}
			})
		}
		//跳页
		function goPage() {
			var pageNum = $("#pageNum").val()
			if(pageNum=="0"||pageNum==""){
				return;
			}
			if (Number(pageNum) > countPage) {
				return;
			} else {
				currentPage = pageNum;
				list();
			}
		}

		


		










		/*删除*/
		function delByIds(id) {
			var ids = [];
			if (id) {
				ids.push(id);
			} else {
				$('#mainTbody > tr > td input[type=checkbox]').each(function () {
					if ($(this).prop("checked")) {
						ids.push($(this).val());
					}
				})
			}

			if (ids.length > 0) {
				if (confirm("确定删除！")) {
					var sql = "delete from device where id in (";
					for (var i = 0; i < ids.length; i++) {
						var id = ids[i];
						if (i == (ids.length - 1)) {
							sql += "\'" + id + "\')";
						} else {
							sql += "\'" + id + "\',";
						}
					}

					executeSql(sql, function (data) {
						if (data.rtn == 1) {
							alert("操作成功");
							$("#myModal").modal('hide');
							list();
						}
						if (data.rtn == 0) {
							alert("操作失败");
						}
					});

				}
			} else {
				alert("未选择任何值！");
			}
		}
		
		
		function listSqlOracle() {
			var data = {
				sql: "Select ksmc From Ms_Netyygh_Yspb Group By ksmc"
			};
			$.ajax({
				url: '/common/listSqlOracle',
				type: 'POST',
				async: true,
				data: data,
				timeout: 5000,
				dataType: 'json',
				success: function (data, textStatus, jqXHR) {
					console.log(data);
				},
				error: function (xhr, textStatus) {
					console.log(textStatus);
				}
			})
		}

		listSqlOracle();

	</script>
</body>

</html>